var trankev = {
	sceneDom:document.getElementById('pipei'),
	socket:io(),
	tankdata:{
		tankposition:{x:'',y:''},
		tankwidth:30,
		tankheight:30,
		tankname:"",
		speed:3,
		direct:'top',
		life:false
	},
	zaidata:[
	{x:50,y:50},
	{x:300,y:200},
	{x:100,y:500},
	{x:500,y:100},
	{x:300,y:400},
	{x:700,y:100},
	{x:500,y:400},
	{x:400,y:500},
//	{x:100,y:80},
//	{x:620,y:310},
//	{x:110,y:310},
//	{x:610,y:80},
	],
	stratposition:[
	{x:0,y:0},
	{x:760,y:0},
	{x:0,y:560},
	{x:760,y:560}
	],
	alltankdata:[],
	roomid:"",
	owndom:document.getElementsByClassName('own')[0],
	didom:document.getElementsByClassName('di')[0],
	newcanvas:'',
	context:'',
	stratGame:function(){
//		console.log(this.newcanvas.getContext('2d'))
	  this.sceneDom.style.display = 'block'
	 /* console.log(this.socket)
	  var x = Math.random()*document.getElementById('canvas').width
      var y = Math.random()*document.getElementById('canvas').height
      if(x>=document.getElementById('canvas').width-100){
      	x = document.getElementById('canvas').width-100
      }
      if(y>=document.getElementById('canvas').height-100){
      	y = document.getElementById('canvas').height-100
      }
//    this.context.fillRect(x,y,50,50)
      this.tankdata.tankposition.x = x
      this.tankdata.tankposition.y = y*/
      
	  this.socket.emit('startPi',{name:sessionStorage.getItem('name')})
	},
	drawtank:function(ur,x,y,w,h){
		var im = new Image()
		var that = this
    			im.src = ur
    				im.onload = function(){
    				
    				that.context.drawImage(im,x,y,w,h)
    			}
	},
	initzai:function(){
		var img = new Image()
		img.src = '../img/zai1.png'
		var img2 = new Image()
		img2.src = '../img/zai4.png'
		
		img.onload = ()=>{
			for(let i=0;i<8;i++){
				
				this.context.drawImage(img,this.zaidata[i].x,this.zaidata[i].y,100,30)
			}
			
			
		}
		/*img2.onload = ()=>{
			for(let i=8;i<this.zaidata.length;i++){
				this.context.drawImage(img2,this.zaidata[i].x,this.zaidata[i].y,100,50)
			}
		}*/
		
	},
	loopAni:function(){
		var data = this.context.getImageData(0,0,this.newcanvas.width,this.newcanvas.height)
		document.getElementById('canvas').getContext('2d').putImageData(data,0,0)
	},
	/*initvisi:function(){
		var img = new Image()
		img.src = '../img/zai5.png'
		img.onload = ()=>{
			this.context.drawImage(img,50,50,100,50)
			this.visidata.push({x:100,y:100})
			this.context.drawImage(img,100,50,100,50)
			this.visidata.push({x:100,y:100})
			this.context.drawImage(img,150,50,100,50)
			this.visidata.push({x:100,y:100})
			this.context.drawImage(img,200,50,100,50)
			this.visidata.push({x:100,y:100})
			this.context.drawImage(img,250,250,100,50)
			this.visidata.push({x:200,y:100})
			this.context.drawImage(img,150,500,100,50)
			this.visidata.push({x:200,y:100})
			this.context.drawImage(img,580,100,100,50)
			this.visidata.push({x:200,y:100})
			this.context.drawImage(img,380,460,100,50)
			this.visidata.push({x:200,y:100})
			this.context.drawImage(img,410,100,100,50)
			this.visidata.push({x:200,y:100})
			
		}
	},*/
    reciveSocket:function(){
    	var that = this
    	this.socket.on('finshPi',function(data){
    		that.newcanvas = document.createElement('canvas')
    		that.newcanvas.width = document.getElementById('canvas').width
    		that.newcanvas.height = document.getElementById('canvas').height
    		that.context = that.newcanvas.getContext('2d')
    		that.roomid = data[data.length-1]
    		
    		trankev.sceneDom.getElementsByTagName('button')[0].innerHTML = '匹配成功'
    		that.context.clearRect(0,0,document.getElementById('canvas').width,document.getElementById('canvas').height)
    		var ar = []	   				  	 
    		setTimeout(function(){
    			that.initzai()
//  			that.initvisi()
    			that.tankdata.life = true
    			that.alltankdata.splice(0,that.tankdata.length)
    	       for(let i=0;i<data.length-1;i++){
    	       	ar.push({name:data[i].name,x:that.stratposition[i].x,y:that.stratposition[i].y})
    			if(data[i].name==sessionStorage.getItem('name')){
    			that.tankdata.tankposition.x = that.stratposition[i].x
                that.tankdata.tankposition.y = that.stratposition[i].y	
                
    			that.drawtank('../img/tank.png',that.stratposition[i].x,that.stratposition[i].y,that.tankdata.tankwidth,that.tankdata.tankheight)
    			console.log('m')
    			}else{
    				console.log('d')
    			that.drawtank('../img/dtankt.png',that.stratposition[i].x,that.stratposition[i].y,that.tankdata.tankwidth,that.tankdata.tankheight)	
    			}
    			
    				
    			
    			
    	       }
    			
    			that.alltankdata = ar
    			document.getElementById('scene').style.display = 'block'
    		},1000)
    	})
    	this.socket.on('doleft',function(data){
    		var nowdata 
    		var other = []
    		console.log(data)
    		
    		that.alltankdata = data.tankdata
    		if(data.tankdata.length>1){
    			for(let i=0;i<data.tankdata.length;i++){
    			if(data.tankdata[i].name==data.name){
    				nowdata = data.tankdata[i]
    				that.alltankdata[i].x = that.alltankdata[i].x - that.tankdata.speed
    				
    			}else{
    				other.push(data.tankdata[i])
    			}
    		}
    		
    		for(var i=0;i<other.length;i++){
    			if(nowdata.x>=other[i].x-5&&nowdata.x<=other[i].x+that.tankdata.tankwidth+5&&nowdata.y>=other[i].y-5&&nowdata.y<=other[i].y+that.tankdata.tankwidth+5){    				
    				for(var i=0;i<that.alltankdata.length;i++){
    			if(that.alltankdata[i].name==data.name){
    				
    				that.alltankdata[i].x = that.alltankdata[i].x+that.tankdata.speed
    				if(data.name==sessionStorage.getItem('name')){
    					
    				    	that.drawtank('../img/tankl.png',that.alltankdata[i].x,that.alltankdata[i].y,that.tankdata.tankwidth,that.tankdata.tankheight)
    				}else{
    				    	that.drawtank('../img/dtankl.png',that.alltankdata[i].x,that.alltankdata[i].y,that.tankdata.tankwidth,that.tankdata.tankheight)
    				}
    			}
    		}
    				that.tankdata.tankposition.x = that.tankdata.tankposition.x + that.tankdata.speed
    				
    				continue
    			}else if(nowdata.x>=other[i].x-5&&nowdata.x<=other[i].x+that.tankdata.tankwidth+5&&nowdata.y+that.tankdata.tankwidth>=other[i].y-5&&nowdata.y+that.tankdata.tankwidth<=other[i].y+that.tankdata.tankwidth+5){   				
    					for(var i=0;i<that.alltankdata.length;i++){
    			if(that.alltankdata[i].name==data.name){
    				
    				that.alltankdata[i].x = that.alltankdata[i].x+that.tankdata.speed
    				if(data.name==sessionStorage.getItem('name')){
    					
    				    	that.drawtank('../img/tankl.png',that.alltankdata[i].x,that.alltankdata[i].y,that.tankdata.tankwidth,that.tankdata.tankheight)
    				}else{
    				    	that.drawtank('../img/dtankl.png',that.alltankdata[i].x,that.alltankdata[i].y,that.tankdata.tankwidth,that.tankdata.tankheight)
    				}
    			}
    		}
    					that.tankdata.tankposition.x = that.tankdata.tankposition.x + that.tankdata.speed
    				continue
    			}
    			else{
    				//检测障碍物
    				for(var i=0;i<that.zaidata.length;i++){
    					if(nowdata.x>=that.zaidata[i].x-5&&nowdata.x<=that.zaidata[i].x+100+5&&nowdata.y>=that.zaidata[i].y-5&&nowdata.y<=that.zaidata[i].y+30+5){    				
    				for(var i=0;i<that.alltankdata.length;i++){
    			if(that.alltankdata[i].name==data.name){
    				
    				that.alltankdata[i].x = that.alltankdata[i].x+that.tankdata.speed
    				if(data.name==sessionStorage.getItem('name')){
    					
    				    	that.drawtank('../img/tankl.png',that.alltankdata[i].x,that.alltankdata[i].y,that.tankdata.tankwidth,that.tankdata.tankheight)
    				}else{
    				    	that.drawtank('../img/dtankl.png',that.alltankdata[i].x,that.alltankdata[i].y,that.tankdata.tankwidth,that.tankdata.tankheight)
    				}
    			}
    		}
    				that.tankdata.tankposition.x = that.tankdata.tankposition.x + that.tankdata.speed
    				
    				return
    			}else if(nowdata.x>=that.zaidata[i].x-5&&nowdata.x<=that.zaidata[i].x+100+5&&nowdata.y+that.tankdata.tankwidth>=that.zaidata[i].y-5&&nowdata.y+that.tankdata.tankwidth<=that.zaidata[i].y+30+5){   				
    					for(var i=0;i<that.alltankdata.length;i++){
    			if(that.alltankdata[i].name==data.name){
    				
    				that.alltankdata[i].x = that.alltankdata[i].x+that.tankdata.speed
    				if(data.name==sessionStorage.getItem('name')){
    					
    				    	that.drawtank('../img/tankl.png',that.alltankdata[i].x,that.alltankdata[i].y,that.tankdata.tankwidth,that.tankdata.tankheight)
    				}else{
    				    	that.drawtank('../img/dtankl.png',that.alltankdata[i].x,that.alltankdata[i].y,that.tankdata.tankwidth,that.tankdata.tankheight)
    				}
    			}
    		}
    					that.tankdata.tankposition.x = that.tankdata.tankposition.x + that.tankdata.speed
    				return
    			}
    				}
    				that.context.clearRect(nowdata.x-1+that.tankdata.speed,nowdata.y-1,that.tankdata.tankwidth+2,that.tankdata.tankheight+2)
//  		        var x = nowdata.x - that.tankdata.speed
    				if(data.name==sessionStorage.getItem('name')){    					
    				    	that.drawtank('../img/tankl.png',nowdata.x,nowdata.y,that.tankdata.tankwidth,that.tankdata.tankheight)
    				}else{
    					    that.drawtank('../img/dtankl.png',nowdata.x,nowdata.y,that.tankdata.tankwidth,that.tankdata.tankheight)
    				}
    				
    				
    		
    			}
    			/*that.context.clearRect(nowdata.x-1+that.tankdata.speed,nowdata.y-1,that.tankdata.tankwidth+2,that.tankdata.tankheight+2)
//  		        var x = nowdata.x - that.tankdata.speed
    		        
    				if(data.name==sessionStorage.getItem('name')){
    					
    				    	that.drawtank('../img/tankl.png',nowdata.x,nowdata.y,that.tankdata.tankwidth,that.tankdata.tankheight)
    				}else{
    					    that.drawtank('../img/dtankl.png',nowdata.x,nowdata.y,that.tankdata.tankwidth,that.tankdata.tankheight)
    				}*/
    		}
    		
    		}else{
    			that.context.clearRect(nowdata.x-1+that.tankdata.speed,nowdata.y-1,that.tankdata.tankwidth+2,that.tankdata.tankheight+2)
    		        var x = nowdata.x - that.tankdata.speed
    		        
    				if(data.name==sessionStorage.getItem('name')){
    					
    				    	that.drawtank('../img/tankl.png',nowdata.x,nowdata.y,that.tankdata.tankwidth,that.tankdata.tankheight)
    				}else{
    					    that.drawtank('../img/dtankl.png',nowdata.y,nowdata.y,that.tankdata.tankwidth,that.tankdata.tankheight)
    				}
    		}
    		
    	})
    	this.socket.on('doright',function(data){
    		var nowdata 
    		var other = []
    		that.alltankdata = data.tankdata
    		if(data.tankdata.length>1){
    			for(var i=0;i<data.tankdata.length;i++){
    			if(data.tankdata[i].name==data.name){
    				that.alltankdata[i].x = that.alltankdata[i].x + that.tankdata.speed
    				nowdata = data.tankdata[i]
    			}else{
    				other.push(data.tankdata[i])
    			}
    		}
    		console.log(nowdata)
    		console.log(other)
    		for(var i=0;i<other.length;i++){
    			if(nowdata.x+that.tankdata.tankwidth>=other[i].x-5&&nowdata.x+that.tankdata.tankwidth<=other[i].x+that.tankdata.tankwidth+5&&nowdata.y>=other[i].y-5&&nowdata.y<=other[i].y+that.tankdata.tankwidth+5){    				
    				
    				for(var j=0;j<that.alltankdata.length;j++){
    			if(that.alltankdata[j].name==data.name){
    				
    				that.alltankdata[j].x = that.alltankdata[j].x-that.tankdata.speed
    				if(data.name==sessionStorage.getItem('name')){
    					
    				    	that.drawtank('../img/tankr.png',that.alltankdata[i].x,that.alltankdata[i].y,that.tankdata.tankwidth,that.tankdata.tankheight)
    				}else{
    				    	that.drawtank('../img/dtankr.png',that.alltankdata[i].x,that.alltankdata[i].y,that.tankdata.tankwidth,that.tankdata.tankheight)
    				}
    			}
    		}
    				that.tankdata.tankposition.x = that.tankdata.tankposition.x - that.tankdata.speed
    				
    				continue
    			}else if(nowdata.x+that.tankdata.tankwidth>=other[i].x-5&&nowdata.x+that.tankdata.tankwidth<=other[i].x+that.tankdata.tankwidth+5&&nowdata.y+that.tankdata.tankwidth>=other[i].y-5&&nowdata.y+that.tankdata.tankwidth<=other[i].y+that.tankdata.tankwidth+5){   				
    					for(var i=0;i<that.alltankdata.length;i++){
    			if(that.alltankdata[i].name==data.name){
    				
    				that.alltankdata[i].x = that.alltankdata[i].x-that.tankdata.speed
    				if(data.name==sessionStorage.getItem('name')){
    					
    				    	that.drawtank('../img/tankr.png',that.alltankdata[i].x,that.alltankdata[i].y,that.tankdata.tankwidth,that.tankdata.tankheight)
    				}else{
    				    	that.drawtank('../img/dtankr.png',that.alltankdata[i].x,that.alltankdata[i].y,that.tankdata.tankwidth,that.tankdata.tankheight)
    				}
    			}
    		}
    					that.tankdata.tankposition.x = that.tankdata.tankposition.x - that.tankdata.speed
    				continue
    			}
    			else{
    				
    				
    				//检测障碍物
    				for(var i=0;i<that.zaidata.length;i++){
    					if(nowdata.x+that.tankdata.tankwidth>=that.zaidata[i].x-5&&nowdata.x+that.tankdata.tankwidth<=that.zaidata[i].x+100+5&&nowdata.y>=that.zaidata[i].y-5&&nowdata.y<=that.zaidata[i].y+30+5){    				
    				
    				for(var j=0;j<that.alltankdata.length;j++){
    			if(that.alltankdata[j].name==data.name){
    				
    				that.alltankdata[j].x = that.alltankdata[j].x-that.tankdata.speed
    				if(data.name==sessionStorage.getItem('name')){
    					
    				    	that.drawtank('../img/tankr.png',that.alltankdata[i].x,that.alltankdata[i].y,that.tankdata.tankwidth,that.tankdata.tankheight)
    				}else{
    				    	that.drawtank('../img/dtankr.png',that.alltankdata[i].x,that.alltankdata[i].y,that.tankdata.tankwidth,that.tankdata.tankheight)
    				}
    			}
    		}
    				that.tankdata.tankposition.x = that.tankdata.tankposition.x - that.tankdata.speed
    				
    				return
    			}else if(nowdata.x+that.tankdata.tankwidth>=that.zaidata[i].x-5&&nowdata.x+that.tankdata.tankwidth<=that.zaidata[i].x+100+5&&nowdata.y+that.tankdata.tankwidth>=that.zaidata[i].y-5&&nowdata.y+that.tankdata.tankwidth<=that.zaidata[i].y+30+5){   				
    					for(var i=0;i<that.alltankdata.length;i++){
    			if(that.alltankdata[i].name==data.name){
    				
    				that.alltankdata[i].x = that.alltankdata[i].x-that.tankdata.speed
    				if(data.name==sessionStorage.getItem('name')){
    					
    				    	that.drawtank('../img/tankr.png',that.alltankdata[i].x,that.alltankdata[i].y,that.tankdata.tankwidth,that.tankdata.tankheight)
    				}else{
    				    	that.drawtank('../img/dtankr.png',that.alltankdata[i].x,that.alltankdata[i].y,that.tankdata.tankwidth,that.tankdata.tankheight)
    				}
    			}
    		}
    					that.tankdata.tankposition.x = that.tankdata.tankposition.x - that.tankdata.speed
    				return
    			}
    				}
    				
    				
    				
    		that.context.clearRect(nowdata.x-that.tankdata.speed-1,nowdata.y-1,that.tankdata.tankwidth+2,that.tankdata.tankheight+2)
//  		var x = nowdata.x + that.tankdata.speed
    		if(data.name==sessionStorage.getItem('name')){
    		that.drawtank('../img/tankr.png',nowdata.x,nowdata.y,that.tankdata.tankwidth,that.tankdata.tankheight)
    		}else{
    		that.drawtank('../img/dtankr.png',nowdata.x,nowdata.y,that.tankdata.tankwidth,that.tankdata.tankheight)	
    		}
    			}
    		}
    		}else{
    			that.context.clearRect(nowdata.x-that.tankdata.speed-1,nowdata.y-1,that.tankdata.tankwidth+2,that.tankdata.tankheight+2)
//  		var x = nowdata.x + that.tankdata.speed
    		if(data.name==sessionStorage.getItem('name')){
    		that.drawtank('../img/tankr.png',nowdata.x,nowdata.y,that.tankdata.tankwidth,that.tankdata.tankheight)
    		}else{
    		that.drawtank('../img/dtankr.png',nowdata.x,nowdata.y,that.tankdata.tankwidth,that.tankdata.tankheight)	
    		}
    		}
    		
    		
    	})
    	this.socket.on('dotop',function(data){
    		var nowdata 
    		var other = []
    		that.alltankdata = data.tankdata
    		if(data.tankdata.length>1){
    			for(var i=0;i<data.tankdata.length;i++){
    			if(data.tankdata[i].name==data.name){
    				that.alltankdata[i].y = that.alltankdata[i].y - that.tankdata.speed
    				nowdata = data.tankdata[i]
    			}else{
    				other.push(data.tankdata[i])
    			}
    		}
    		console.log(nowdata)
    		console.log(other)
    		for(var i=0;i<other.length;i++){
    			if(nowdata.x+that.tankdata.tankwidth>=other[i].x-5&&nowdata.x+that.tankdata.tankwidth<=other[i].x+that.tankdata.tankwidth+5&&nowdata.y>=other[i].y-5&&nowdata.y<=other[i].y+that.tankdata.tankwidth+5){    				
    				for(var i=0;i<that.alltankdata.length;i++){
    			if(that.alltankdata[i].name==data.name){
    				
    				that.alltankdata[i].y = that.alltankdata[i].y+that.tankdata.speed
    				if(data.name==sessionStorage.getItem('name')){
    					
    				    	that.drawtank('../img/tank.png',that.alltankdata[i].x,that.alltankdata[i].y,that.tankdata.tankwidth,that.tankdata.tankheight)
    				}else{
    				    	that.drawtank('../img/dtankt.png',that.alltankdata[i].x,that.alltankdata[i].y,that.tankdata.tankwidth,that.tankdata.tankheight)
    				}
    			}
    		}
    				that.tankdata.tankposition.y = that.tankdata.tankposition.y + that.tankdata.speed
    				continue
    			}else if(nowdata.x>=other[i].x-5&&nowdata.x<=other[i].x+that.tankdata.tankwidth+5&&nowdata.y>=other[i].y-5&&nowdata.y<=other[i].y+that.tankdata.tankwidth+5){   				
    					for(var i=0;i<that.alltankdata.length;i++){
    			if(that.alltankdata[i].name==data.name){
    				
    				that.alltankdata[i].y = that.alltankdata[i].y+that.tankdata.speed
    				if(data.name==sessionStorage.getItem('name')){
    					
    				    	that.drawtank('../img/tank.png',that.alltankdata[i].x,that.alltankdata[i].y,that.tankdata.tankwidth,that.tankdata.tankheight)
    				}else{
    				    	that.drawtank('../img/dtankt.png',that.alltankdata[i].x,that.alltankdata[i].y,that.tankdata.tankwidth,that.tankdata.tankheight)
    				}
    			}
    		}
    					that.tankdata.tankposition.y = that.tankdata.tankposition.y + that.tankdata.speed
    				continue
    			}
    			else{
    			
    			
    			//检测障碍物
    				for(var i=0;i<that.zaidata.length;i++){
    					if(nowdata.x+that.tankdata.tankwidth>=that.zaidata[i].x-5&&nowdata.x+that.tankdata.tankwidth<=that.zaidata[i].x+100+5&&nowdata.y>=that.zaidata[i].y-5&&nowdata.y<=that.zaidata[i].y+30+5){    				
    				for(var i=0;i<that.alltankdata.length;i++){
    			if(that.alltankdata[i].name==data.name){
    				
    				that.alltankdata[i].y = that.alltankdata[i].y+that.tankdata.speed
    				if(data.name==sessionStorage.getItem('name')){
    					
    				    	that.drawtank('../img/tank.png',that.alltankdata[i].x,that.alltankdata[i].y,that.tankdata.tankwidth,that.tankdata.tankheight)
    				}else{
    				    	that.drawtank('../img/dtankt.png',that.alltankdata[i].x,that.alltankdata[i].y,that.tankdata.tankwidth,that.tankdata.tankheight)
    				}
    			}
    		}
    				that.tankdata.tankposition.y = that.tankdata.tankposition.y + that.tankdata.speed
    				return
    			}else if(nowdata.x>=that.zaidata[i].x-5&&nowdata.x<=that.zaidata[i].x+100+5&&nowdata.y>=that.zaidata[i].y-5&&nowdata.y<=that.zaidata[i].y+30+5){   				
    					for(var i=0;i<that.alltankdata.length;i++){
    			if(that.alltankdata[i].name==data.name){
    				
    				that.alltankdata[i].y = that.alltankdata[i].y+that.tankdata.speed
    				if(data.name==sessionStorage.getItem('name')){
    					
    				    	that.drawtank('../img/tank.png',that.alltankdata[i].x,that.alltankdata[i].y,that.tankdata.tankwidth,that.tankdata.tankheight)
    				}else{
    				    	that.drawtank('../img/dtankt.png',that.alltankdata[i].x,that.alltankdata[i].y,that.tankdata.tankwidth,that.tankdata.tankheight)
    				}
    			}
    		}
    					that.tankdata.tankposition.y = that.tankdata.tankposition.y + that.tankdata.speed
    				return
    			}
    				}
    				
    				
    				
    				
    				
    		that.context.clearRect(nowdata.x-1,nowdata.y-1+that.tankdata.speed,that.tankdata.tankwidth+2,that.tankdata.tankheight+2)
//  		var y = nowdata.y - that.tankdata.speed
    		if(data.name==sessionStorage.getItem('name')){
    		that.drawtank('../img/tank.png',nowdata.x,nowdata.y,that.tankdata.tankwidth,that.tankdata.tankheight)
    		}else{
    			that.drawtank('../img/dtankt.png',nowdata.x,nowdata.y,that.tankdata.tankwidth,that.tankdata.tankheight)
    		}
//  		that.context.fillRect(data.x,y,that.tankdata.tankwidth,that.tankdata.tankheight)
    			}
    		}
    		}else{
    			that.context.clearRect(nowdata.x-1,nowdata.y-1+that.tankdata.speed,that.tankdata.tankwidth+2,that.tankdata.tankheight+2)
//  		var y = nowdata.y - that.tankdata.speed
    		if(data.name==sessionStorage.getItem('name')){
    		that.drawtank('../img/tank.png',nowdata.x,nowdata.y,that.tankdata.tankwidth,that.tankdata.tankheight)
    		}else{
    			that.drawtank('../img/dtankt.png',nowdata.x,nowdata.y,that.tankdata.tankwidth,that.tankdata.tankheight)
    		}
    		}
    		
    		
    	})
    	this.socket.on('dodown',function(data){
    		var nowdata 
    		var other = []
    		that.alltankdata = data.tankdata
    		if(data.tankdata.length>1){
    			for(var i=0;i<data.tankdata.length;i++){
    			if(data.tankdata[i].name==data.name){
    				that.alltankdata[i].y = that.alltankdata[i].y + that.tankdata.speed
    				nowdata = data.tankdata[i]
    			}else{
    				other.push(data.tankdata[i])
    			}
    		}
    		console.log(nowdata)
    		console.log(other)
    		for(var i=0;i<other.length;i++){
    			if(nowdata.x+that.tankdata.tankwidth>=other[i].x-5&&nowdata.x+that.tankdata.tankwidth<=other[i].x+that.tankdata.tankwidth+5&&nowdata.y+that.tankdata.tankwidth>=other[i].y-5&&nowdata.y+that.tankdata.tankwidth<=other[i].y+that.tankdata.tankwidth+5){    				
    				for(var i=0;i<that.alltankdata.length;i++){
    			if(that.alltankdata[i].name==data.name){
    				
    				that.alltankdata[i].y = that.alltankdata[i].y-that.tankdata.speed
    				if(data.name==sessionStorage.getItem('name')){
    					
    				    	that.drawtank('../img/tankd.png',that.alltankdata[i].x,that.alltankdata[i].y,that.tankdata.tankwidth,that.tankdata.tankheight)
    				}else{
    				    	that.drawtank('../img/dtankd.png',that.alltankdata[i].x,that.alltankdata[i].y,that.tankdata.tankwidth,that.tankdata.tankheight)
    				}
    			}
    		}
    				that.tankdata.tankposition.y = that.tankdata.tankposition.y - that.tankdata.speed
    				continue
    			}else if(nowdata.x>=other[i].x-5&&nowdata.x<=other[i].x+that.tankdata.tankwidth+5&&nowdata.y+that.tankdata.tankwidth>=other[i].y-5&&nowdata.y+that.tankdata.tankwidth<=other[i].y+that.tankdata.tankwidth+5){   				
    					for(var i=0;i<that.alltankdata.length;i++){
    			if(that.alltankdata[i].name==data.name){
    				
    				that.alltankdata[i].y = that.alltankdata[i].y-that.tankdata.speed
    				if(data.name==sessionStorage.getItem('name')){
    					
    				    	that.drawtank('../img/tankd.png',that.alltankdata[i].x,that.alltankdata[i].y,that.tankdata.tankwidth,that.tankdata.tankheight)
    				}else{
    				    	that.drawtank('../img/dtankd.png',that.alltankdata[i].x,that.alltankdata[i].y,that.tankdata.tankwidth,that.tankdata.tankheight)
    				}
    			}
    		}
    					that.tankdata.tankposition.y = that.tankdata.tankposition.y - that.tankdata.speed
    				continue
    			}
    			else{
    			
    			//检测障碍物
    				for(var i=0;i<that.zaidata.length;i++){
    				if(nowdata.x+that.tankdata.tankwidth>=that.zaidata[i].x-5&&nowdata.x+that.tankdata.tankwidth<=that.zaidata[i].x+100+5&&nowdata.y+that.tankdata.tankwidth>=that.zaidata[i].y-5&&nowdata.y+that.tankdata.tankwidth<=that.zaidata[i].y+30+5){    				
    				for(var i=0;i<that.alltankdata.length;i++){
    			if(that.alltankdata[i].name==data.name){
    				
    				that.alltankdata[i].y = that.alltankdata[i].y-that.tankdata.speed
    				if(data.name==sessionStorage.getItem('name')){
    					
    				    	that.drawtank('../img/tankd.png',that.alltankdata[i].x,that.alltankdata[i].y,that.tankdata.tankwidth,that.tankdata.tankheight)
    				}else{
    				    	that.drawtank('../img/dtankd.png',that.alltankdata[i].x,that.alltankdata[i].y,that.tankdata.tankwidth,that.tankdata.tankheight)
    				}
    			}
    		}
    				that.tankdata.tankposition.y = that.tankdata.tankposition.y - that.tankdata.speed
    				return
    			}else if(nowdata.x>=that.zaidata[i].x-5&&nowdata.x<=that.zaidata[i].x+100+5&&nowdata.y+that.tankdata.tankwidth>=that.zaidata[i].y-5&&nowdata.y+that.tankdata.tankwidth<=that.zaidata[i].y+30+5){   				
    					for(var i=0;i<that.alltankdata.length;i++){
    			if(that.alltankdata[i].name==data.name){
    				
    				that.alltankdata[i].y = that.alltankdata[i].y-that.tankdata.speed
    				if(data.name==sessionStorage.getItem('name')){
    					
    				    	that.drawtank('../img/tankd.png',that.alltankdata[i].x,that.alltankdata[i].y,that.tankdata.tankwidth,that.tankdata.tankheight)
    				}else{
    				    	that.drawtank('../img/dtankd.png',that.alltankdata[i].x,that.alltankdata[i].y,that.tankdata.tankwidth,that.tankdata.tankheight)
    				}
    			}
    		}
    					that.tankdata.tankposition.y = that.tankdata.tankposition.y - that.tankdata.speed
    				return
    			}	
    				}
    	  		
    				
    				
    				
    				
    		that.context.clearRect(nowdata.x-1,nowdata.y-1-that.tankdata.speed,that.tankdata.tankwidth+2,that.tankdata.tankheight+2)
    		var y = nowdata.y + that.tankdata.speed
    		if(data.name==sessionStorage.getItem('name')){
    		that.drawtank('../img/tankd.png',nowdata.x,nowdata.y,that.tankdata.tankwidth,that.tankdata.tankheight)
    		}else{
    		that.drawtank('../img/dtankd.png',nowdata.x,nowdata.y,that.tankdata.tankwidth,that.tankdata.tankheight)	
    		}
//  		that.context.fillRect(data.x,y,that.tankdata.tankwidth,that.tankdata.tankheight)
    			}
    		}
    		}else{
    			that.context.clearRect(nowdata.x-1,nowdata.y-1-that.tankdata.speed,that.tankdata.tankwidth+2,that.tankdata.tankheight+2)
    		var y = nowdata.y + that.tankdata.speed
    		if(data.name==sessionStorage.getItem('name')){
    		that.drawtank('../img/tankd.png',nowdata.x,nowdata.y,that.tankdata.tankwidth,that.tankdata.tankheight)
    		}else{
    		that.drawtank('../img/dtankd.png',nowdata.x,nowdata.y,that.tankdata.tankwidth,that.tankdata.tankheight)	
    		}
    		}
    		
    		
    	}),
    	
    	this.socket.on('dofire',function(data){
    		console.log(data.direct)
    		switch(data.direct){
    			
    			case 'left':
    			     var im = new Image()
    			   if(data.name==sessionStorage.getItem('name')){
    			   	im.src = '../img/danl.png'
    			   }else{
    			   	im.src = '../img/hdanl.png'
    			   }
    			   
    			   im.onload = function(){
    			   	var i = 20
    			   var t = setInterval(function(){
    			 
    			   	     for(var j=0;j<that.zaidata.length;j++){
    			   			if(data.x-i>=that.zaidata[j].x-2&&data.x-i<=that.zaidata[j].x+100+20&&data.y+(that.tankdata.tankheight/2)-10>=that.zaidata[j].y-2&&data.y+(that.tankdata.tankheight/2)-10<=that.zaidata[j].y+30+2){
    			   				
    			   				that.context.clearRect(data.x-i,data.y+(that.tankdata.tankheight/2)-10,20,20)
    			   				clearInterval(t)
    			   				return
    			   			}else if(data.x-i>=that.zaidata[j].x-2&&data.x-i<=that.zaidata[j].x+100+20&&data.y+(that.tankdata.tankheight/2)-10+20>=that.zaidata[j].y-2&&data.y+(that.tankdata.tankheight/2)-10+20<=that.zaidata[j].y+30+2){
    			   				
    			   				that.context.clearRect(data.x-i,data.y+(that.tankdata.tankheight/2)-10,20,20)
    			   				clearInterval(t)
    			   				return
    			   			}
    			   		}
    			   	
    			   		if(data.x-i<=0){
    			   		that.context.clearRect(data.x-i,data.y+(that.tankdata.tankheight/2)-10,20,20)
    			   		clearInterval(t)
    			   		return
    			   		}else{   			   			
    			   		that.context.clearRect(data.x-i,data.y+(that.tankdata.tankheight/2)-10,20,20)	
    			   		i += 15 
    			   		for(let j=0;j<that.alltankdata.length;j++){
    			   			if(data.name==that.alltankdata[j].name){
    			   				continue
    			   			}
    			   				if(that.alltankdata[j].x<=data.x-i&&that.alltankdata[j].x+100>=data.x-i&&data.y+(that.tankdata.tankheight/2)-10>=that.alltankdata[j].y&&data.y+(that.tankdata.tankheight/2)-10<=that.alltankdata[j].y+100){
    			   				that.context.clearRect(that.alltankdata[j].x,that.alltankdata[j].y,that.tankdata.tankwidth,that.tankdata.tankheight)
    			   				var img = new Image()
    			   				img.src = '../img/baoz.png'
    			   				img.onload = function(){
    			   					that.context.drawImage(img,that.alltankdata[j].x,that.alltankdata[j].y,that.tankdata.tankwidth,that.tankdata.tankheight)
    			   					/*var n = 10
    			   					var d = setInterval(function(){
    			   						n = n + 10
    			   						that.context.drawImage(img,that.alltankdata[j].x,that.alltankdata[j].y,n,n)
    			   						if(n==100){
    			   							clearInterval(d)
    			   						}
    			   					},50)*/
    			   				
    			   				  setTimeout(function(){
    			   				  	 that.context.clearRect(that.alltankdata[j].x,that.alltankdata[j].y,that.tankdata.tankwidth,that.tankdata.tankheight)
    			   				  	 
    			   				  	
    			   				  	 if(that.alltankdata[j].name==sessionStorage.getItem('name')){
    			   				  	 	that.context.clearRect(0,0,document.getElementById('canvas').width,document.getElementById('canvas').height)
    			   				  	    that.tankdata.life = false
    			   				  	    that.context.font = "italic 45px 黑体";
    			   				  	    that.context.fillStyle = 'red'
    			   				  	    that.context.fillText('GAME OVER',250,250)
    			   				  	    that.context.fillStyle = 'white'
    			   				  	    that.context.fillText('按任意键重新开始游戏',150,300)
    			   				  	 }
    			   				  	 that.alltankdata.splice(j,j+1)
    			   				  	 if(that.alltankdata.length==1){
    			   				  	 	if(that.alltankdata[0].name==sessionStorage.getItem('name')){
    			   				  	 	that.context.clearRect(0,0,document.getElementById('canvas').width,document.getElementById('canvas').height)
    			   				  	 	that.tankdata.life = false
    			   				  	 	that.context.font = "italic 45px 黑体";
    			   				  	 	that.context.fillStyle = 'red'
    			   				  	    that.context.fillText('GAME VICTORY',300,250)
    			   				  	    that.context.fillStyle = 'white'
    			   				  	    that.context.fillText('按任意键重新开始游戏',150,300)
    			   				  	 }
    			   				  	 }
    			   				  },3000)
    			   				}
    			   				
    			   				clearInterval(t)
    			   				console.log(data.x-i)
    			   				that.context.clearRect(data.x-i-10,data.y+(that.tankdata.tankheight/2)-10,20,20)
    			   				return
    			   			}    			   			
    			   		}
    			   		
    			   		
    			   		that.context.drawImage(im,data.x-i,data.y+(that.tankdata.tankheight/2)-10,20,20)
    			   		
    			   		}
    			   		
    			   	},50)
    			   	  
    			   }
    			   break;
    			case 'right':
    			  var im = new Image()
    			   if(data.name==sessionStorage.getItem('name')){
    			   	im.src = '../img/danr.png'
    			   }else{
    			   	im.src = '../img/hdanr.png'
    			   }
    			   
    			   im.onload = function(){
    			   	var i = 0
    			   	var t = setInterval(function(){
    			   		 for(var j=0;j<that.zaidata.length;j++){
    			   			if(data.x+i+that.tankdata.tankwidth+20>=that.zaidata[j].x-2-20&&data.x+i+that.tankdata.tankwidth+20<=that.zaidata[j].x+100+2&&data.y+(that.tankdata.tankheight/2)-10>=that.zaidata[j].y-2&&data.y+(that.tankdata.tankheight/2)-10<=that.zaidata[j].y+30+2){
    			   				clearInterval(t)
    			   				that.context.clearRect(data.x+i+that.tankdata.tankwidth,data.y+(that.tankdata.tankheight/2)-10,20,20)
    			   				return
    			   			}else if(data.x+i+that.tankdata.tankwidth+20>=that.zaidata[j].x-2-20&&data.x+i+that.tankdata.tankwidth+20<=that.zaidata[j].x+100+2&&data.y+(that.tankdata.tankheight/2)-10+20>=that.zaidata[j].y-2&&data.y+(that.tankdata.tankheight/2)-10+20<=that.zaidata[j].y+30+2){
    			   				clearInterval(t)
    			   				that.context.clearRect(data.x+i+that.tankdata.tankwidth,data.y+(that.tankdata.tankheight/2)-10,20,20)
    			   				return
    			   			}
    			   		}
    			   		if(data.x+i>=document.getElementById('canvas').width){
    			   		that.context.clearRect(data.x+i+that.tankdata.tankwidth,data.y+(that.tankdata.tankheight/2)-10,20,20)
    			   		clearInterval(t)
    			   		return
    			   		}else{
    			   			
    			   		that.context.clearRect(data.x+i+that.tankdata.tankwidth,data.y+(that.tankdata.tankheight/2)-10,20,20)	
    			   			i += 15
    			   			for(let j=0;j<that.alltankdata.length;j++){
    			   			if(data.name==that.alltankdata[j].name){
    			   				continue
    			   			}
    			   				if(that.alltankdata[j].x<=data.x+i+that.tankdata.tankwidth&&that.alltankdata[j].x+that.tankdata.tankwidth>=data.x+i+that.tankdata.tankwidth&&data.y+(that.tankdata.tankheight/2)-10>=that.alltankdata[j].y&&data.y+(that.tankdata.tankheight/2)-10<=that.alltankdata[j].y+that.tankdata.tankwidth){
    			   				var img = new Image()
    			   				img.src = '../img/baoz.png'
    			   				img.onload = function(){
    			   						that.context.drawImage(img,that.alltankdata[j].x,that.alltankdata[j].y,that.tankdata.tankwidth,that.tankdata.tankheight)
    			   					
    			   				
    			   				  setTimeout(function(){
    			   				  	 that.context.clearRect(that.alltankdata[j].x,that.alltankdata[j].y,that.tankdata.tankwidth,that.tankdata.tankheight)
    			   				  	 
    			   				  	
    			   				  	 if(that.alltankdata[j].name==sessionStorage.getItem('name')){
    			   				  	 	that.context.clearRect(0,0,document.getElementById('canvas').width,document.getElementById('canvas').height)
    			   				  	    that.tankdata.life = false
    			   				  	    that.context.font = "italic 45px 黑体";
    			   				  	    that.context.fillStyle = 'red'
    			   				  	    that.context.fillText('GAME OVER',250,250)
    			   				  	    that.context.fillStyle = 'white'
    			   				  	    that.context.fillText('按任意键重新开始游戏',150,300)
    			   				  	 }
    			   				  	 that.alltankdata.splice(j,j+1)
    			   				  	 if(that.alltankdata.length==1){
    			   				  	 	if(that.alltankdata[0].name==sessionStorage.getItem('name')){
    			   				  	 	that.context.clearRect(0,0,document.getElementById('canvas').width,document.getElementById('canvas').height)
    			   				  	 	that.tankdata.life = false
    			   				  	 	that.context.font = "italic 45px 黑体";
    			   				  	 	that.context.fillStyle = 'red'
    			   				  	    that.context.fillText('GAME VICTORY',300,250)
    			   				  	    that.context.fillStyle = 'white'
    			   				  	    that.context.fillText('按任意键重新开始游戏',150,300)
    			   				  	 }
    			   				  	 }
    			   				  },3000)
    			   				}
    			   				
    			   				clearInterval(t)
    			   				that.context.clearRect(data.x+i+that.tankdata.tankwidth+10,data.y+(that.tankdata.tankheight/2)-10,20,20)
    			   				return
    			   			}
    			   			
    			   			
    			   		}
    			   		that.context.drawImage(im,data.x+i+that.tankdata.tankwidth,data.y+(that.tankdata.tankheight/2)-10,20,20)
    			   		}
    			   		
    			   	},50)
    			   	  
    			   }
    			   break;
    			case 'top':
    			   var im = new Image()
    			   if(data.name==sessionStorage.getItem('name')){
    			   	im.src = '../img/dant.png'
    			   }else{
    			   	im.src = '../img/hdant.png'
    			   }
    			   
    			   im.onload = function(){
    			   	var i = 20
    			   	var t =setInterval(function(){
    			   		for(var j=0;j<that.zaidata.length;j++){
    			   			if(data.x+(that.tankdata.tankwidth/2)-10>=that.zaidata[j].x-2&&data.x+(that.tankdata.tankwidth/2)-10<=that.zaidata[j].x+100+2&&data.y-i>=that.zaidata[j].y-2+20&&data.y-i<=that.zaidata[j].y+30+2){
    			   				clearInterval(t)
    			   				that.context.clearRect(data.x+(that.tankdata.tankwidth/2)-10,data.y-i,20,20)
    			   				return
    			   			}else if(data.x+(that.tankdata.tankwidth/2)-10+20>=that.zaidata[j].x-2&&data.x+(that.tankdata.tankwidth/2)-10+20<=that.zaidata[j].x+100+2&&data.y-i>=that.zaidata[j].y-2+20&&data.y-i<=that.zaidata[j].y+30+2){
    			   				clearInterval(t)
    			   				that.context.clearRect(data.x+(that.tankdata.tankwidth/2)-10,data.y-i,20,20)
    			   				return
    			   			}
    			   		}
    			   		if(data.y-i<=0){
    			   		that.context.clearRect(data.x+(that.tankdata.tankwidth/2)-10,data.y-i,20,20)
    			   		clearInterval(t)
    			   		return
    			   		}else{
    			   			
    			   		that.context.clearRect(data.x+(that.tankdata.tankwidth/2)-10,data.y-i,20,20)	
    			   			i += 15
    			   			for(let j=0;j<that.alltankdata.length;j++){
    			   			if(data.name==that.alltankdata[j].name){
    			   				continue
    			   			}
    			   				if(that.alltankdata[j].x<=data.x+(that.tankdata.tankwidth/2)-10&&that.alltankdata[j].x+100>=data.x+(that.tankdata.tankwidth/2)-10&&data.y-i>=that.alltankdata[j].y&&data.y-i<=that.alltankdata[j].y+100){
    			   				var img = new Image()
    			   				img.src = '../img/baoz.png'
    			   				img.onload = function(){
    			   						that.context.drawImage(img,that.alltankdata[j].x,that.alltankdata[j].y,that.tankdata.tankwidth,that.tankdata.tankheight)
    			   					
    			   				
    			   				  setTimeout(function(){
    			   				  	 that.context.clearRect(that.alltankdata[j].x,that.alltankdata[j].y,that.tankdata.tankwidth,that.tankdata.tankheight)
    			   				  	 
    			   				  	
    			   				  	 if(that.alltankdata[j].name==sessionStorage.getItem('name')){
    			   				  	 	that.context.clearRect(0,0,document.getElementById('canvas').width,document.getElementById('canvas').height)
    			   				  	    that.tankdata.life = false
    			   				  	    that.context.font = "italic 45px 黑体";
    			   				  	    that.context.fillStyle = 'red'
    			   				  	    that.context.fillText('GAME OVER',250,250)
    			   				  	    that.context.fillStyle = 'white'
    			   				  	    that.context.fillText('按任意键重新开始游戏',150,300)
    			   				  	 }
    			   				  	 that.alltankdata.splice(j,j+1)
    			   				  	 if(that.alltankdata.length==1){
    			   				  	 	if(that.alltankdata[0].name==sessionStorage.getItem('name')){
    			   				  	 	that.context.clearRect(0,0,document.getElementById('canvas').width,document.getElementById('canvas').height)
    			   				  	 	that.tankdata.life = false
    			   				  	 	that.context.font = "italic 45px 黑体";
    			   				  	 	that.context.fillStyle = 'red'
    			   				  	    that.context.fillText('GAME VICTORY',300,250)
    			   				  	    that.context.fillStyle = 'white'
    			   				  	    that.context.fillText('按任意键重新开始游戏',150,300)
    			   				  	 }
    			   				  	 }
    			   				  },3000)
    			   				}
    			   				
    			   				clearInterval(t)
    		
    			   				that.context.clearRect(data.x+(that.tankdata.tankwidth/2)-10,data.y-i-10,20,20)
    			   				return
    			   			}
    			   			
    			   			
    			   		}
    			   			console.log(data.x+'----'+data.y)
    			   		that.context.drawImage(im,data.x+(that.tankdata.tankwidth/2)-10,data.y-i,20,20)
    			   		}
    			   		
    			   	},50)
    			   	  
    			   }
    			   break;
    			case 'down':
    			  var im = new Image()
    			   if(data.name==sessionStorage.getItem('name')){
    			   	im.src = '../img/dand.png'
    			   }else{
    			   	im.src = '../img/hdand.png'
    			   }
    			   
    			   im.onload = function(){
    			   	var i = 0
    			   	var t = setInterval(function(){
    			   		for(var j=0;j<that.zaidata.length;j++){
    			   			if(data.x+(that.tankdata.tankwidth/2)-10+20>=that.zaidata[j].x-2&&data.x+(that.tankdata.tankwidth/2)-10+20<=that.zaidata[j].x+100+2&&data.y+i+that.tankdata.tankwidth+20>=that.zaidata[j].y-2-20&&data.y+i+that.tankdata.tankwidth+20<=that.zaidata[j].y+30+2){
    			   				clearInterval(t)
    			   				that.context.clearRect(data.x+(that.tankdata.tankwidth/2)-10,data.y+i+that.tankdata.tankwidth,20,20)
    			   				return
    			   			}else if(data.x+(that.tankdata.tankwidth/2)-10+20>=that.zaidata[j].x-2&&data.x+(that.tankdata.tankwidth/2)-10+20<=that.zaidata[j].x+100+2&&data.y+i+that.tankdata.tankwidth+20>=that.zaidata[j].y-2-20&&data.y+i+that.tankdata.tankwidth+20<=that.zaidata[j].y+30+2){
    			   				clearInterval(t)
    			   				that.context.clearRect(data.x+(that.tankdata.tankwidth/2)-10,data.y+i+that.tankdata.tankwidth,20,20)
    			   				return
    			   			}
    			   		}
    			   		
    			   		
    			   		if(data.y+i>=document.getElementById('canvas').height){
    			   		that.context.clearRect(data.x+(that.tankdata.tankwidth/2)-10,data.y+i+that.tankdata.tankwidth,20,20)
    			   		clearInterval(t)
    			   		return
    			   		}else{
    			   			
    			   		that.context.clearRect(data.x+(that.tankdata.tankwidth/2)-10,data.y+i+that.tankdata.tankwidth,20,20)	
    			   			i += 15
    			   			for(let j=0;j<that.alltankdata.length;j++){
    			   			if(data.name==that.alltankdata[j].name){
    			   				continue
    			   			}
    			   				if(that.alltankdata[j].x<=data.x+(that.tankdata.tankwidth/2)-10&&that.alltankdata[j].x+that.tankdata.tankwidth>=data.x+(that.tankdata.tankwidth/2)-10&&data.y+i+that.tankdata.tankwidth>=that.alltankdata[j].y&&data.y+i+that.tankdata.tankwidth<=that.alltankdata[j].y+that.tankdata.tankwidth){
    			   				var img = new Image()
    			   				img.src = '../img/baoz.png'
    			   				img.onload = function(){
    			   						that.context.drawImage(img,that.alltankdata[j].x,that.alltankdata[j].y,that.tankdata.tankwidth,that.tankdata.tankheight)
    			   				
    			   				
    			   				  setTimeout(function(){
    			   				  	 that.context.clearRect(that.alltankdata[j].x,that.alltankdata[j].y,that.tankdata.tankwidth,that.tankdata.tankheight)
    			   				  	 
    			   				  	
    			   				  	 if(that.alltankdata[j].name==sessionStorage.getItem('name')){
    			   				  	 	that.context.clearRect(0,0,document.getElementById('canvas').width,document.getElementById('canvas').height)
    			   				  	    that.tankdata.life = false
    			   				  	    that.context.font = "italic 45px 黑体";
    			   				  	    that.context.fillStyle = 'red'
    			   				  	    that.context.fillText('GAME OVER',250,250)
    			   				  	    that.context.fillStyle = 'white'
    			   				  	    that.context.fillText('按任意键重新开始游戏',150,300)
    			   				  	 }
    			   				  	 that.alltankdata.splice(j,j+1)
    			   				  	 if(that.alltankdata.length==1){
    			   				  	 	if(that.alltankdata[0].name==sessionStorage.getItem('name')){
    			   				  	 	that.context.clearRect(0,0,document.getElementById('canvas').width,document.getElementById('canvas').height)
    			   				  	 	that.tankdata.life = false
    			   				  	 	that.context.font = "italic 45px 黑体";
    			   				  	 	that.context.fillStyle = 'red'
    			   				  	    that.context.fillText('GAME VICTORY',300,250)
    			   				  	    that.context.fillStyle = 'white'
    			   				  	    that.context.fillText('按任意键重新开始游戏',150,300)
    			   				  	 }
    			   				  	 }
    			   				  },3000)
    			   				}
    			   				
    			   				clearInterval(t)
    		
    			   				that.context.clearRect(data.x+(that.tankdata.tankwidth/2)-10,data.y+i+that.tankdata.tankwidth+10,20,20)
    			   				return
    			   			}
    			   			
    			   			
    			   		}
    			   		that.context.drawImage(im,data.x+(that.tankdata.tankwidth/2)-10,data.y+i+that.tankdata.tankwidth,20,20)
    			   		}
    			   		
    			   	},50)
    			   	  
    			   }
    			   break;
    		}
    	})
    },
    impact:function(){
   	
   },
    keydown:function(ev){
    	if(!this.tankdata.life){
    		document.getElementById('scene').style.display = 'none'
    		document.getElementById('pipei').style.display = 'none'
    	}
    	switch(ev.keyCode){
    		case 37://left  
    		if(this.tankdata.life){
    			
    		this.tankdata.direct = 'left'
    		console.log(this.alltankdata)
    		this.socket.emit('leftmove',{name:sessionStorage.getItem('name'),x:this.tankdata.tankposition.x,y:this.tankdata.tankposition.y,'roomid':this.roomid,'tankdata':this.alltankdata});
    		
    		
    		
    		}
    		
    		break;
    		case 39://right
    		if(this.tankdata.life){
    		/*for(var i=0;i<this.alltankdata.length;i++){
    			if(this.alltankdata[i].name==sessionStorage.getItem('name')){
    				
    				this.alltankdata[i].x = this.alltankdata[i].x+this.tankdata.speed
    			}
    		}*/
    		this.tankdata.direct = 'right'
    		this.socket.emit('rightmove',{name:sessionStorage.getItem('name'),x:this.tankdata.tankposition.x,y:this.tankdata.tankposition.y,'roomid':this.roomid,'tankdata':this.alltankdata});
    		
    		}
    		break;
    		case 38://top
    		if(this.tankdata.life){
    		/*for(var i=0;i<this.alltankdata.length;i++){
    			if(this.alltankdata[i].name==sessionStorage.getItem('name')){
    				
    				this.alltankdata[i].y = this.alltankdata[i].y-this.tankdata.speed
    			}
    		}*/
    		this.tankdata.direct = 'top'
    		this.socket.emit('topmove',{name:sessionStorage.getItem('name'),x:this.tankdata.tankposition.x,y:this.tankdata.tankposition.y,'roomid':this.roomid,'tankdata':this.alltankdata});
    		
    		}
    		break;
    		case 40://down
    		if(this.tankdata.life){
    		/*for(var i=0;i<this.alltankdata.length;i++){
    			if(this.alltankdata[i].name==sessionStorage.getItem('name')){
    				
    				this.alltankdata[i].y = this.alltankdata[i].y+this.tankdata.speed
    			}
    		}*/
    		this.tankdata.direct = 'down'
    		this.socket.emit('downmove',{name:sessionStorage.getItem('name'),x:this.tankdata.tankposition.x,y:this.tankdata.tankposition.y,'roomid':this.roomid,'tankdata':this.alltankdata});
    		
    		}
    		break;
    		case 13:
    		
    		if(document.getElementById('name-warp').style.display == 'block'){
    			if(document.querySelector('#name-warp input').value!==''){
    				sessionStorage.setItem('name',document.querySelector('#name-warp input').value)
    			document.querySelector('.name').innerHTML = 'welcome to tank word '+document.querySelector('#name-warp input').value
    			document.getElementById('name-warp').style.display = 'none'
    		}else{
    			alert('name must input !')
    		}
    		}else{
    			return
    		}
    		break;
    		
    		case 32:
    		if(this.tankdata.life){
    		this.fire()
    		}
    	}
    },
    fire:function(){
    	for(var i=0;i<this.alltankdata.length;i++){
    		if(this.alltankdata[i].name == sessionStorage.getItem('name')){
    			this.tankdata.tankposition.x = this.alltankdata[i].x
    			this.tankdata.tankposition.y = this.alltankdata[i].y
    		}
    	}
    	this.socket.emit('fire',{name:sessionStorage.getItem('name'),x:this.tankdata.tankposition.x,y:this.tankdata.tankposition.y,direct:this.tankdata.direct,'roomid':this.roomid})
    }
	
}
trankev.reciveSocket()
document.addEventListener('keydown',function(e){
	var ev = event||e
	trankev.keydown(ev)
})
setInterval(function(){
	if(trankev.newcanvas){
		trankev.loopAni()
	}
	
},50)

if(sessionStorage.getItem('name')){
	document.getElementById('name-warp').style.display = 'none'
	document.querySelector('.name').innerHTML = 'welcome to tank word '+sessionStorage.getItem('name')    		
}else{
	document.getElementById('name-warp').style.display = 'block'
}
